<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>收货地址管理</title>
    <link rel="icon" type="image/x-icon" href="/static/image/user/title-icon.jpg"/>
    <link rel="stylesheet" href="/static/css/user/reset.css"/>
    <link rel="stylesheet" href="/static/css/user/top.css"/>
    <link rel="stylesheet" href="/static/css/user/deliverAddress.css"/>
    <link rel="stylesheet" href="/static/css/user/footer.css"/>
    <link rel="stylesheet" href="/static/css/user/font-awesome-4.7.0/Font-Awesome-master/css/font-awesome.min.css"/>
</head>
<body>
<!--头部-->
<div class="top" id="top">
    <!--头部bar-->
    <jsp:include page="../head.jsp"></jsp:include>
    <!--编辑收货地址-->
    <div class="w1230">
        <h3 class="add-title">新增收货地址</h3>
        <div class="add-address">
            <form action="/user/deliverAddress/addAddress" method="post">
                <input type="text" name="userId" value="${user.id}" hidden>
                <div class="add-area">
                    <label>地址信息：</label>
                    <div id="area"></div>
                </div>
                <p>
                    <label>详细地址：</label>
                    <textarea placeholder="请输入详细地址信息，如道路、门牌号、小区、楼栋号、单元等信息" class="add-detail" name="detailedAddress"
                              required></textarea>
                </p>
                <p>
                    <label>收货人姓名：</label>
                    <input type="text" class="add-name" placeholder="请输入收货人姓名" name="name" required/>
                </p>
                <p>
                    <label>手机号码：</label>
                    <input type="text" class="add-tel" placeholder="请输入收货人手机号" name="tel" required/>
                </p>
                <p class="chk-address">
                    <input type="checkbox" name="isDefault"/>
                    <span>设置为默认收货地址</span>
                </p>
                <input type="submit" value="保存" class="save-btn"/>
            </form>
        </div>
    </div>
    <!--收货地址列表-->
    <div class="add-list w1230">
        <p class="message"><i class="fa fa-exclamation-circle"></i>只能保存5个地址</p>
        <table class="table-list">
            <tr>
                <th class="t-name">收货人</th>
                <th class="t-address">收货地址</th>
                <th class="t-tel">手机号</th>
                <th class="t-operate">操作</th>
                <th class="t-default"></th>
            </tr>
            <c:forEach items="${userAddress}" var="userAddres">
                <tr>
                    <input type="hidden" value="${userAddres.id}">
                    <input type="hidden" value="${userAddres.province}">
                    <input type="hidden" value="${userAddres.city}">
                    <input type="hidden" value="${userAddres.area}">
                    <input type="hidden" value="${userAddres.detailedAddress}">
                    <td>${userAddres.name}</td>
                    <td>${userAddres.province}${userAddres.city}${userAddres.area}${userAddres.detailedAddress}</td>
                    <td>${userAddres.tel}</td>
                    <td><a class="revise">修改</a>|
                        <a href="/user/deliverAddress/deleteAddress?id=${userAddres.id}">删除</a>
                    </td>
                    <c:if test="${userAddres.isDefault == 1}">
                        <td class="default-on">默认地址</td>
                    </c:if>
                    <c:if test="${userAddres.isDefault != 1}">
                        <td><a href="/user/deliverAddress/reviseDefault?id=${userAddres.id}">设为默认</a></td>
                    </c:if>
                </tr>
            </c:forEach>
        </table>
    </div>
    <!--脚注-->
    <div class="footer">
        <p class="w1230">
            <a href="#">关于爱购</a>
            <a href="#">合作伙伴</a>
            <a href="#">营销中心</a>
            <a href="#">廉正举报</a>
            <a href="#">联系客服</a>
            <a href="#">开发平台</a>
            <a href="#">诚征英才</a>
            <a href="#">联系我们</a>
            <a href="#">网站地图</a>
            <a href="#">知识产权</a><span>|</span>
            <span>&copy;2018-2020 igo.com 版权所有</span>
        </p>
    </div>
</div>
<script src="/static/js/user/area.js"></script>
<script src="/static/js/jquery/jquery-3.7.1.min.js"></script>
<script>
    $(function () {
        // 给修改添加点击事件
        $(".revise").click(function () {
            let id = $(this).closest("tr").find("input").val();
            // 发送一个ajax请求带上数据id
            $.post("/user/deliverAddress/ajaxGetAddress", {"id": id}, function (data) {
                // 返回的地址对象
                let address = data;
                // 接受返回值，循环查找并设置默认显示省、市、区   4
                $("select").each(function(e) {
                    // 如果当前data.地址 == 找到 文件中地址为 data.地址 并取值
                    if (e == 0){
                        $(this).find("option[value='" + address.province + "']").trigger("chang")
                    }
                    if (e == 1 ){
                        $(this).find("option[value='" + address.city + "']").trigger("chang")
                    }
                    if (e == 2){
                        $(this).find("option[value='" + address.area + "']").trigger("chang")
                    }
                    // if (e){
                    //     let value = $(this).find("option[value='" + address.province + "']").text();
                    //     console.log(value)
                    //     $(this).val(value).trigger("change");
                    // }
                });
            });

        });
    })
</script>
</body>
</html>

